<template>
  <div>
    <a-row>
      <a-col :span="12"  class='mb20'>
          <a-input  placeholder="请输入名称"  class='w200'/>
          <a-button type="primary">搜索</a-button>
      </a-col>
    </a-row>
     
    <a-table :columns="columns" :dataSource="data"  :pagination="pagination"  >
      <span slot="customTitle">名称</span>
      <span slot="modifyTime" slot-scope="text, record"  > 
        {{text | formatDate}}
      </span>
      <span slot="action" slot-scope="text, record"  > 
        <a  class='color-blue'  @click='edit(record.code)'>编辑</a>
        <a-divider type="vertical" />
        <a-popconfirm title="确认删除当前数据？" @confirm="confirmDel(record.code)"   okText="确认" cancelText="取消">
            <a href="javascript:;"  class='color-red'>删除</a>
        </a-popconfirm>
      </span>
    </a-table>
    
  </div>
</template>

<script>

import  {  journalList  }  from  '@/api/system/index' 

export default {
  name: 'journal',
  data () {
    return {
      columns:[{
        dataIndex: 'name',
        key: 'name',
        slots: { title: 'customTitle' },
        scopedSlots: { customRender: 'name' },
      }, {
        title: '描述',
        dataIndex: 'description',
      }, {
        title: '相关用户',
        dataIndex: 'userNum',
      },
      {
        title: '更新时间',
        // slots: { title: 'time' },
        dataIndex: 'modifyTime',
        scopedSlots: { customRender: 'modifyTime' },
      },{
        title: '创建人',
        dataIndex: 'createUserName',
      },  
       {
        title: '操作',
        key: 'action',
        scopedSlots: { customRender: 'action' },
      }],
      //
      search:{
        pageNo:1,
        pageSize:10
      },
    data:[],
    pagination:{
        total:0,
        pageSize: 10,//每页中显示10条数据
        showSizeChanger: true,

        pageSizeOptions: ["10", "20"],//每页中显示的数据
        showTotal: total => `共有 ${total} 条数据`,  //分页中显示总的数据
      }, 
     showAddRole:false,
     MenuData:[],
    }
  },
  created(){
    this.pageInit() 
  },
  methods:{
    pageInit(){
      journalList(this.search).then((res)=>{
        this.data = res.data.dataList
      })
    },
     
 
    
  },
  components:{
     
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>
